<form class="layui-form seller-form"  action="" >
    <div class="layui-form-item">
        <div class="layui-inline" style="display:none;">
            <label class="layui-form-label">账号：</label>
            <div class="layui-input-inline">
                <input type="text" name="username" lay-verify="title" style="width:100px;" placeholder="请输入账号" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">手机号码：</label>
            <div class="layui-input-inline seller-inline-3">
                <input type="text" name="mobile" lay-verify="title" placeholder="请输入手机号码" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">性别：</label>
            <div class="layui-input-inline seller-inline-2" >
                <select name="sex" lay-verify="">
                    <option value=""></option>
                    <option value="1">男</option>
                    <option value="2">女</option>
                    <option value="3">其他</option>
                </select>
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">生日：</label>
            <div class="layui-input-inline seller-inline-2">
                <input type="text" name="birthday" lay-verify="title" placeholder="生日日期" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">昵称：</label>
            <div class="layui-input-inline seller-inline-2">
                <input type="text" name="nickname" lay-verify="title" placeholder="用户昵称" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">状态：</label>
            <div class="layui-input-inline seller-inline-3">
                <select name="status" lay-verify="">
                    <option value=""></option>
                    <option value="1">正常</option>
                    <option value="2">停用</option>
                </select>
            </div>
        </div>
        <div class="layui-inline">
	        <div class="layui-input-block">
	            <button class="layui-btn layui-btn-sm" lay-submit lay-filter="*"><i class="iconfont icon-chaxun"></i>筛选</button>
	        </div>
        </div>
    </div>
</form>

<div class="table-body">
    <table id="userTable" lay-filter="test"></table>
</div>

<script>
    layui.use(['form', 'layedit', 'laydate','table'], function(){
        layui.table.render({
            elem: '#userTable',
            height: 'full-330',
            cellMinWidth: '80',
            page: 'true',
            limit:'20',
            url: "{:url('user/index')}?_ajax=1",
            id:'userTable',
            cols: [[
                {type:'numbers'},
//                {field:'username', width:100,title:'账号'},
                {field:'mobile', width:160,title:'手机号码'},
                {field:'sex', width:80,minWidth: 50,title:'性别'},
                {field:'birthday',width:200,title:'生日'},
                {field:'avatar',title:'头像',
                    templet: function(d){
                        if (d.avatar) {
                            return '<a href="javascript:void(0);" onclick=viewImage("'+d.avatar+'")><image style="max-width:30px;max-height:30px;" src="'+d.avatar+'"/></a>';
                        }else{
                            return '<a href="javascript:void(0);" onclick=viewImage("<?php echo config('jshop.default_image'); ?>")><image style="max-width:30px;max-height:30px;" src="<?php echo config('jshop.default_image');?>"/></a>';
                        }
                    }
                },
                {field:'nickname',title:'昵称'},
                {field:'status',title:'状态'}
            ]]
        });
        layui.form.on('submit(*)', function(data){
            layui.table.reload('userTable', {
                where: data.field
                ,page: {
                    curr: 1 //重新从第 1 页开始
                }
            });
            return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
        });
    });
</script>
